<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      // 思考：为什么新增块级作用域

      // 1. 问题1
      var temp = new Date();
      function fn() {
        console.log(temp);
        if (false) {
          // if是语句
          var temp = "hello world";
        }
      }
      fn();

      //==>
      // function fn(){
      //     // 1. var 声明的变量会提升到当前作用域的最前面
      //     // 2. if是语句，不是函数，var声明变量不能形成作用域
      //     // 3. var 声明的变量，只声明，不赋值，默认是undefined
      //     var temp
      //     console.log(temp)
      //     if(false){  // if是语句
      //         temp = 'hello world'
      //     }
      // }

      // 2. var声明的变量，在for循环中，提升到全局
      for (var i = 0; i <= 3; i++) {
        console.log(i);
      }
      // 最后循环完，i++， i变为4
      console.log(i);

      // 总结一下：
      // ==>  if / for 不是函数，他们是语句，用var声明的变量，不能形成作用域；
      // 为什么需要块级作用域？
      // var 变量
      // 1. 内层变量可能覆盖外层变量
      // 2. 用来计数的循环变量i,会泄露为全局变量
    </script>
  </body>
</html>
